import { reactive, ref } from 'vue';
import { Message } from '@arco-design/web-vue';
import _ from "lodash"
import { clearAllCheck, setCheckedStatus } from "../utils"
import { createRole, switchRoleStatus, updateRole, getRoleData } from '@/api/role/role';
import type { CallBackData } from '@/components/dialog/type.d';
import type { RoleListParams, RoleListItem } from '@/api/role/role.d';
import useTableData from './useTableData';
import useRole from './useRole';
// import useUtils from './useUtils';
export default function useCompose() {
    const currentId = ref(0)
    // 查询表单
    const searchForm = reactive<RoleListParams>({
        name: undefined as unknown as string,
        page: 1,
        pageSize: 10
    });

    // 列表数据
    const { columns, data, scroll, total, getTableData } = useTableData(searchForm);

    const { addRoleVisibile, addRoleForm, roleFormRef, title, isDisabled, checkall, indeterminate, dialogType, secondVisibile, handeleAddRoleClick } = useRole();

    // const { clearAllCheck, setCheckedStatus } = useUtils()

    // 重置
    const reset = () => {
        searchForm.name = undefined as unknown as string;
        searchForm.page = 1;
        searchForm.pageSize = 10;
        getTableData();
    }

    // 查询
    const search = () => {
        searchForm.page = 1;
        getTableData();
    }

    // 页码操作
    const handleSizeChange = (size: number) => {
        searchForm.page = size;
        getTableData();
    };
    
    // 每页条数操作
    const handlePageSizeChange = (pageSize: number) => {
        searchForm.pageSize = pageSize;
        getTableData();
    };

    // 保存角色
    const handleRoleVisible = async (data: CallBackData) => {
        console.log(data, '弹窗点击', addRoleForm.value);
        if (data.status === 'save') {
            const validateRes = await roleFormRef.dom.validate();
            data.done(true);
            if (validateRes === undefined) {
                if (dialogType.value !== 3) {
                    let res
                    // 针对id去重否则会重复插入数据
                    const { permIds, ...newAddForm } = addRoleForm.value
                    const newArr = Array.from(new Set(permIds))
                    dialogType.value === 1 && (res = await createRole({
                        ...newAddForm,
                        permIds: newArr
                    }))
                    dialogType.value === 2 && (res = await updateRole({
                        ...newAddForm,
                        permIds: newArr,
                        id: currentId.value
                    }))
                    if (res.code === 200 || res.code === 0) {
                        dialogType.value === 1 && Message.success('新增成功');
                        dialogType.value === 2 && Message.success("编辑成功")
                        addRoleVisibile.value = data.flag;
                        getTableData();
                    }
                } else {
                    addRoleVisibile.value = data.flag;
                }
                roleFormRef.dom.resetFields();
                clearAllCheck()
                checkall.value = false
                indeterminate.value = false
            }
        } else if (data.status === 'clear') {
            // addRoleVisibile.value = data.flag;
            dialogType.value !== 3 && (secondVisibile.value = true)
            if (dialogType.value === 3) {
                addRoleVisibile.value = data.flag;
                roleFormRef.dom.resetFields();
                clearAllCheck()
                checkall.value = false
                indeterminate.value = false
            }
        }
    }
    // 备份处理数据
    // const temoObj = ref<{ name: string; description: string; permIds: number[]; }>({} as { name: string; description: string; permIds: number[]; })
    // 二次确认
    const handleSecondVisible = (data: CallBackData) => {
        console.log(data, "=====");
        if (data.status === 'save') {
            secondVisibile.value = data.flag
            roleFormRef.dom.resetFields()
            clearAllCheck()
            checkall.value = false
            indeterminate.value = false
            addRoleVisibile.value = data.flag
        } else {
           secondVisibile.value = data.flag
        //    addRoleVisibile.value = data.flag
        }
    }

    // 修改角色状态
    const handleRoleStatus = async (item: RoleListItem) => {
        const params = {
            id: item.id,
            status: item.status
        }
        const res = await switchRoleStatus(params);
        // @ts-ignore
        if (res?.code === 200) {
            Message.success('修改成功');
            getTableData();
        }
    };

    // 编辑点击
    const handleUpdateRoleClick = async (item: RoleListItem) => {
        const { id, ...newItem} = item;
        const params = {
            id
        }
        currentId.value = id
        const res = await getRoleData(params)
        if (res) {
            const { permList, name, description, id, ...newRes } = res
            const temp = {
                name,
                description,
                permIds: permList.map(t => t.id)
            }
            // temoObj.value = _.cloneDeep(temp)
            setCheckedStatus(temp.permIds, checkall, indeterminate)
            title.value = "编辑角色"
            dialogType.value = 2
            addRoleForm.value = temp
            isDisabled.value = false
            addRoleVisibile.value = true
        }
        
    }

    // 查看点击
    const handleQueryRoleClick = async (item: RoleListItem) => {
        const { id, ...newItem} = item;
        const params = {
            id
        }
        currentId.value = id
        const res = await getRoleData(params)
        if (res) {
            const { permList, name, description, id, ...newRes } = res
            const temp = {
                name,
                description,
                permIds: permList.map(t => t.id)
            }
            setCheckedStatus(temp.permIds, checkall, indeterminate)
            title.value = "查看角色"
            dialogType.value = 3
            addRoleForm.value = temp
            isDisabled.value = true
            addRoleVisibile.value = true
        }
    }

    return {
        searchForm,
        reset,
        search,
        columns,
        data,
        scroll,
        total,
        getTableData,
        handleSizeChange,
        handlePageSizeChange,
        addRoleVisibile,
        addRoleForm,
        roleFormRef,
        title,
        isDisabled,
        checkall,
        indeterminate,
        secondVisibile,
        dialogType,
        handeleAddRoleClick,
        handleUpdateRoleClick,
        handleRoleVisible,
        handleRoleStatus,
        handleQueryRoleClick,
        handleSecondVisible
    }
}